<include file="public@storage"/>
<link rel="stylesheet" href="__STATIC__/storage/qrcode/qrcode.css"/>
</head>
<body>

<div class="container body-content" style="margin-top:20px; width: 100%">
    <div class="panel panel-info" style="margin-bottom: 0.5rem">
        <div class="panel-heading"><span id="storageName">{$storageInfo[0]['name']}</span>物料详情</div>
        <input type="hidden" id="storageUuid" value="{$storageInfo[0]['uuid']}">
        <div class="panel-body">
            <div class="row">
                <div class="col-sm-12">
                    <div id="toolbar" class="btn-group">
                        <button class="btn btn-info" style="margin-left: 5px;width: 8rem" onclick="downloadExcel()">
                            导出EXCEL
                        </button>
                        <button class="btn btn-info" style="margin-left: 5px;width: 8rem" onclick="updateMateriel()">
                            更新物料
                        </button>
                        <select id="selectStorage" class="btn btn-info" style="margin-left: 5px; width: 10rem"
                                onchange="changeStorage()">
                            <option value="">请选择仓库</option>
                            <volist id="uuid" name="storageInfo" id="value">
                                <option value="{$value['uuid']}">{$value['name']}</option>
                            </volist>
                        </select>
                        <!-- 按钮触发模态框 -->
                    </div>
                    <table id="table"></table>
                </div>
            </div>
        </div>
    </div>
    <div class='qrcode' id="qrcode" style="display: none"></div>
</div>
</body>
<script src="__STATIC__/storage/qrcode/qrcode.min.js"></script>
<script src="__STATIC__/storage/js/common/selectStorage.js"></script>
<script>
    var storageUuid = $("#storageUuid").val();
    $(function () {
        if ($("#storageUuid").val() === '') {
            $("#selectStorage").show();
        } else {
            $("#selectStorage").hide();
        }
        init();
    });

    function init() {
        var url = "{:url('Query/queryMateriel')}?storageUuid=" + storageUuid;
        var columns = [
            {
                title: '序号',
                width: 50,
                align: "center",
                valign: 'middle',
                formatter: function (value, row, index) {
                    return index + 1;
                }
            },
            {
                title: '物料号',
                field: 'sub_materiel_id',
                align: "center",
                valign: 'middle',
                filter: {
                    type: 'input'
                }
            },
            {
                title: '物料名',
                field: 'sub_materiel_name',
                align: "center",
                valign: 'middle',
                filter: {
                    type: 'input'
                }
            },
            {
                title: '内码',
                field: 'item_id',
                align: "center",
                valign: 'middle',
                filter: {
                    type: 'input'
                }
            },
            {
                title: '最小包装',
                field: 'min_quantity',
                align: "center",
                valign: 'middle',
                filter: {
                    type: 'input'
                }
            },
            {
                title: '类型',
                field: 'shelves_type',
                align: "center",
                valign: 'middle',
                filter: {
                    type: 'input'
                }
            },
            {
                title: '件数',
                field: 'type_count',
                align: "center",
                valign: 'middle',
                filter: {

                    type: 'input'
                }
            },
            {
                title: '架上数量',
                field: 'reel_count',
                align: "center",
                valign: 'middle',
                filter: {
                    type: 'input'
                }
            },
            {
                title: '账上数量',
                field: 'supplier_count',
                align: "center",
                valign: 'middle',
                filter: {
                    type: 'input'
                }
            },
            {
                title: '操作',
                field: 'uuid',
                width: 200,
                align: "center",
                valign: 'middle',
                formatter: function (value, row, index) {
                    var html = '<a class="print" onclick="printCode(this)" href="javascript:;" data-materiel="' + row.sub_materiel_id+ '" >二维码</a>';
                    html += '&nbsp&nbsp|&nbsp&nbsp';
                    html += '<a onclick="updateMateriel(this)" href="javascript:;" data-materiel="' + row.sub_materiel_id+ '" >更新</a>';
                    return html;
                }
            }
        ];
        initTable(url, columns, 'server', InitSubTable);
    }

    InitSubTable = function (index, row, $detail) {
        var tableId = "cur_table_"+index;
        $detail.html('<table id="'+ tableId+ '"></table>').find('table');
        var subMaterielId = row.sub_materiel_id;
        var url = "{:url('Query/queryMaterielDetail')}?subMaterielId=" + subMaterielId+'&storageUuid='+storageUuid;
        var column = [
            {
                title: '序号',
                width: 50,
                align: "center",
                valign: 'middle',
                formatter: function (value, row, index) {
                    return index + 1;
                }
            },
            {
                title: '条码',
                field: 'reel_id',
                align: "center",
                filter: {
                    type: 'input'
                }
            },
            {
                title: '数量',
                field: 'count',
                align: "center",
                filter: {
                    type: 'input'
                }
            },
            {
                title: '站位',
                field: 'seat_code',
                align: "center",
                filter: {
                    type: 'input'
                }
            },
            {
                title: '容器',
                field: 'container_code',
                align: "center",
                filter: {
                    type: 'input'
                }
            },
            {
                title: '时间',
                field: 'time',
                align: "center",
                filter: {
                    type: 'input'
                }
            },
            {
                title: '天数',
                field: 'day',
                align: "center",
                filter: {
                    type: 'input'
                }
            },
            {
                title: '仓库',
                field: 'name',
                align: "center",
                filter: {
                    type: 'input'
                }
            }
        ];
        initSubTable(tableId,url, column, 'server');
    };


    printCode = function (that) {
        var materiel = $(that).data('materiel');
        var code = $('.qrcode');
        $('.qrcode canvas').remove();
        $('.qrcode img').remove();
        $('.qrcode p').remove();
        var qrcode = new QRCode(document.getElementById('qrcode'), {
            text: materiel,
            width: 256,
            height: 256
        });
        layer.open({
            type: 1,
            title: false,
            closeBtn: 0,
            area: ['300px', '300px'],
            skin: '', //没有背景色
            shadeClose: true,
            content: $('.qrcode')
        });
        var html = "<p class='q-qrcode'>" + materiel + "</p>";
        code.append(html);
    };

    updateMateriel = function (that) {
        var materiel = $(that).data('materiel');
        var data = {materiel:materiel};
        var url = "{:url('storage/Materiel/updateMaterielInfo')}";
        var success = function(){
            $('#table').bootstrapTable('refresh');
        };
        reviseTable('',url,data,success);
    };

    downloadExcel = function () {
        var filter = $('#table').bootstrapTable('getOptions')['queryParams'];
        console.log(filter);
        window.location.href = "{:url('storage/Query/downLoadMateriel')}?storageUuid="+storageUuid+'&filter='+filter;
    };

</script>
</html>